<template>
  <div>
    <!-- 悦享生活首页 -->
   
    <Ft />
    <div id="main">
      <!-- 我的缴费-->
      <topnav :topData="topData" />
      <!-- 分类导航 -->
      <Fenlei :fenleiData="fenleiData" />
      <!-- 轮播 -->
      <lunbo />
      <!-- 政府服务 -->
      <zffw :zffwData="zffwData"></zffw>
      <!-- 优惠-->
      <youhui :youhui="youhui" />
      <!-- 惠生活，人气商户 -->
      <hshhuo :shenghuo="shenghuo" />
    </div>
  </div>
</template>

<script>
//先引用--封装好的link.js
import link from "@/api/link.js";
//首页--组件引用

import topnav from "@/components/life/shouye/topnav.vue";
import Fenlei from "@/components/life/shouye/fenlei.vue";
import zffw from "@/components/life/shouye/zffw.vue";
import youhui from "@/components/life/shouye/youhui.vue";
import lunbo from "@/components/life/shouye/lunbo.vue";
import hshhuo from "@/components/life/shouye/hshhuo.vue";

// import syindex from "@/components/life/shouye/index.vue"
export default {
  components: {
    topnav,
    Fenlei,
    zffw,
    youhui,
    lunbo,
    hshhuo,
   
  },
  data() {
    return {
      topData: [],
      fenleiData: [],
      zffwData: [],
      youhui: [],
      shenghuo: [],
    };
  },
  mounted() {
    //需要自动发送请求---axios调用link---发送请求；
    //我的缴费
    link("user/life1/datamock").then(({ data }) => {
      console.log(data);
      this.topData = data.topData;
    });
    //分类导航
    link("user/life2/datamock").then(({ data }) => {
      console.log(data);
      this.fenleiData = data.fenleiData;
    });
    //优惠
    link("user/life4/datamock").then(({ data }) => {
      console.log(data);
      this.youhui = data.youhui;
    });
    //惠生活
    link("user/life5/datamock").then(({ data }) => {
      console.log(data);
      this.shenghuo = data.shenghuo;
    });
  },
};
</script>

<style>
#main {
  height: 1000px;
  overflow: auto;
  margin-bottom: 0.7333rem;
}
</style>